import Taro, { Component } from '@tarojs/taro'
import { View, Text, Image, Picker, Swiper, SwiperItem, Button } from '@tarojs/components'
import {AtButton, AtImagePicker, AtInput, AtModal, AtModalHeader, AtModalContent, AtModalAction, AtToast} from 'taro-ui'
import './editCaseImage.scss'
import reactMixin  from 'react-mixin'
import myJs from './editCaseImageJs.js'
// require("taro-ui/dist/weapp/components/modal/index.scss")

export default class EditCaseImage extends Component {
    constructor () { 
        super(...arguments); 
        this.state = this.getData(); 
    }
    config = {
        navigationBarTitleText: '修改病历照片'
    }

    init() {
        this.state.case_detail.id = this.$router.params.id;
        this.setState({
            case_detail: this.state.case_detail
        });

        this.getCase_detail();
    }

    

    closeModal() {
        this.setState({
            isOpened: false,
            tempImg: ''
        });
    }

    showToast(text) {
        this.setState({
            message: text,
            isOpened2: true
        });
    }

    toastClose() {
        this.setState({
            isOpened2: false
        });
    }

    render () {
        return (
            <View className='editCaseImage'>
                <AtToast onClose={this.toastClose} hasMask={true} isOpened={this.state.isOpened2} text={this.state.message} icon="alert-circle"></AtToast>
                <AtModal isOpened={this.state.isOpened}>
                    <AtModalHeader>请输入照片名称</AtModalHeader>
                    <AtModalContent>
                            <AtInput type='text' value={this.state.text} onChange={this.handleChange.bind(this, 'text')}/>
                    </AtModalContent>
                    <AtModalAction>
                        <Button onClick={this.closeModal.bind(this)}>取消</Button> 
                        <Button onClick={this.comfirmModal.bind(this)}>确定</Button>
                    </AtModalAction>
                </AtModal>
                <View className="subject">
                    <View className="txt">
                        <Text>病历照片</Text>
                    </View>
                    <AtImagePicker onChange={this.imageChange} files={this.state.images} />
                </View>
                
                <AtButton type='primary' size='normal' full={true} className="bottom" onClick={this.updateCase_detail.bind(this)}>保存</AtButton>
            </View>
        );
    }
}

reactMixin.onClass(EditCaseImage, myJs);
